<el-drawer
    title="角色管理"
    :visible.sync="create.drawer"
    direction="rtl"
    size="530px"
    custom-class="Va-drawer fixed"
    {{--  监测抽屉鼠标事件  --}}
    :wrapper-closable="mousedownClassBol"
    @mousedown.native="handleWrapperMousedown($event)"
    @mouseup.native="handleWrapperMouseup($event)"
    {{--  监测抽屉鼠标事件 End  --}}
    v-cloak data-7512a93d
>
    <div>
        <el-row :gutter="24" type="flex" class="Va-drawer-main" :style="layouts.drawerFixedHeight" data-7512a93d>
            <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
                <el-form ref="create.model" :model="create.model" :rules="create.rules" label-position="top" size="medium" class="Va-forms" data-7512a93d>
                    <el-form-item label="所属组织" prop="group_id">
                        <el-cascader
                                placeholder="--请选择所属组织--"
                                :options="parentsGroupItems"
                                v-model="create.model.group_id"
                                :props="{expandTrigger:'hover', checkStrictly:true}"
                                @change="emptyChange"  style="width: 100%" clearable>
                        </el-cascader>
                    </el-form-item>

                    <el-form-item label="角色名称" required prop="name">
                        <el-input v-model="create.model.name" placeholder="请填写角色名称" maxlength="30" show-word-limit></el-input>
                    </el-form-item>

                    <el-form-item label="角色描述" prop="description">
                        <el-input type="textarea" v-model="create.model.description" placeholder="请填写角色描述" rows="3" maxlength="120" show-word-limit></el-input>
                    </el-form-item>

                    <el-form-item label="角色权限" prop="menu_ids">
                        <el-button type="primary" size="mini" @click="openRoleJurisdiction"><i class="fa fa-edit"></i>
                            设置权限
                        </el-button>
                        <span class="table-span success" v-if="create.model.menu_ids.length > 0"><i class="el-icon-circle-check"></i>已设置</span>
                        <span class="table-span warning" v-else><i class="el-icon-circle-close"></i>未设置</span>
                        @include('admin.framework.manage.role.menu')
                    </el-form-item>

                    <el-form-item label="角色状态" prop="status">
                        <el-switch v-model="create.model.status" active-text="开启" inactive-text="关闭"></el-switch>
                    </el-form-item>
                </el-form>
            </el-col>
        </el-row>
        <div slot="footer" class="Va-drawer-footer" data-7512a93d>
            <div class="Va-text-left" data-7512a93d>
                <el-button @click="drawerFormsSubmits('create')" type="primary" size="medium" :loading="create.loading">
                    @{{create.loading ? '提交中...' : '提 交'}}
                </el-button>
                <el-button @click="drawerFormsCloses('create')" size="medium">取 消</el-button>
            </div>
        </div>
    </div>
</el-drawer>

